import { getAlarmTypeList } from '@/api/securityManagement'
import { BasicColumn, FormSchema } from '@/components/Table'
import { Tag } from 'ant-design-vue'
import { h } from 'vue'

export const columns: BasicColumn[] = [
  {
    title: '告警时间',
    dataIndex: 'alarmTime',
  },
  {
    title: '设备名称',
    dataIndex: 'device',
    customRender: ({ record }) => {
      return record.device.name
    },
  },
  {
    title: '告警类型',
    dataIndex: 'alarmType',
    customRender: ({ record }) => {
      return record.alarmType.name
    },
  },
  {
    title: '告警内容',
    dataIndex: 'alarmContent',
    // customRender: ({ record }) => {
    //   return record.description
    // },
  },
  {
    title: '告警值',
    dataIndex: 'alarmValue',
  },
  // {
  //   title: '告警处理时间',
  //   dataIndex: 'processTime',
  // },
  {
    title: '告警状态',
    dataIndex: 'processStatus',
    customRender: ({ record }) => {
      let color, text

      switch (record.processStatus) {
        case 0:
          ;(color = '#f50'), (text = '告警中')
          break
        case 1:
          ;(color = '#108ee9'), (text = '人工复位')
          break
        default:
          ;(color = '#66cdaa'), (text = '自行消除')
          break
      }
      // const status = record.processStatus == 1
      // const color = status ? '#108ee9' : '#f50'
      // const text = status ? '已处理' : '未处理'
      return h(Tag, { color: color }, () => text)
    },
  },
]

export const searchFormSchema: FormSchema[] = [
  {
    field: 'deviceName',
    label: '设备名称',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'time',
    component: 'RangePicker',
    label: '起止日期',
    colProps: { span: 10 },
  },
  // {
  //   field: 'alarmTypeIds',
  //   label: '告警类型',
  //   // component: 'Input',
  //   colProps: { span: 10 },
  //   component: 'ApiSelect',
  //   componentProps: () => {
  //     return {
  //       api: getAlarmTypeList,
  //       labelField: 'name',
  //       valueField: 'id',
  //       // mode: 'multiple',
  //       allowClear: true,
  //       // maxTagCcount: 3,
  //       // maxTagTextLength: 10,
  //       // getPopupContainer: () => {
  //       //   return document.querySelector('.ant-board')!
  //       // },
  //     }
  //   },
  // },
  // {
  //   field: 'deleteStatus',
  //   label: '状态',
  //   component: 'Select',
  //   componentProps: {
  //     options: [
  //       { label: '启用', value: 1 },
  //       { label: '停用', value: 0 },
  //     ],
  //   },
  //   colProps: { span: 6 },
  // },
]

export const HandleModalFormSchema: FormSchema[] = [
  {
    label: '处理意见',
    field: 'processContent',
    component: 'InputTextArea',
    required: true,
    componentProps: {
      placeholder: '请输入',
      autoSize: { minRows: 3, maxRows: 5 },
    },
  },
]
